<template>
    <h2>显示投资项目</h2>
    项目名称<input type="text" v-model="Iname" placeholder="输入项目名称">
    投资项目总额度<input type="text" v-model="MinBudget" placeholder="输入投资项目总额度下限">
    <input type="text" v-model="MaxBudget" placeholder="输入投资项目总额度上限">
    <button @click="show">查询</button>
    <table class="table table-bordered">
    <thead>
        <tr>
            <td>项目编号</td>
            <td>项目名称</td>
            <td>投资项目总额度</td>
            <td>已投资金额</td>
            <td>投资人数</td>
            <td>操作</td>
        </tr>
    </thead>
   <tbody>
    <tr v-for="i in info">
        <td>{{i.I_Id}}</td>
            <td>{{i.I_Name}}</td>
            <td>{{i.I_Budget}}</td>
            <td>{{i.I_Receive}}</td>
            <td>{{i.I_Number}}</td>
            <td>
            <a href="#" @click="UpdateInfo(i.I_Id)">修改</a>
            <a href="#" @click="DeleteInfo(i.I_Id)">删除</a>
            </td>
        </tr>
   </tbody>
    </table>
<a href="#" @click="PageLoadInfo('F')">首页</a>
<a href="#" @click="PageLoadInfo('E')">上一页</a>
<a href="#" @click="PageLoadInfo('I')">下一页</a>
<a href="#" @click="PageLoadInfo('D')">尾页</a>

<select @click="ChangeSize" v-model="Csize" >
    <option value="1">每页一条</option>
    <option value="2">每页二条</option>
    <option value="3">每页三条</option>
</select>

<input type="text" v-model="Tindex" >
<button @click="TakeShowInfo">跳转</button>


</template>
<script setup lang="ts">
import { ref,onMounted } from 'vue';
import { useRouter } from 'vue-router';
import axios from 'axios';


const router = useRouter();

onMounted(() => {
    show();
});



const info = ref([{
    I_Id:0,
    I_Name:"",
    I_Budget:0,
    I_Receive:0,
    I_Residue:0,
    I_Number:0
}]);

    
const Iname = ref('');
const MinBudget = ref(0);
const MaxBudget = ref(0);


const page = ref({
    pageSize:2,
    pageIndex:1,
    listCount:0,
    pageCount:0
})

const show=()=>{
    axios.get('http://localhost:58004/api/invest/ShowinvestInfo',{
        params:{
            Fname:Iname.value,
            MinBudget:MinBudget.value,
            MaxBudget:MaxBudget.value,
            pageSize:page.value.pageSize,
            pageIndex:page.value.pageIndex
        }
    }
    ).then(res=>{
        console.log(res.data);
        info.value=res.data.Plist;
        page.value.listCount=res.data.listCount;
        page.value.pageCount=res.data.pageCount;
        console.log(page.value.pageCount);
        console.log(page.value.listCount);
    })
    .catch(err=>{
        console.log(err);
    })
}

const PageLoadInfo = (msg:string)=>{
    switch(msg){
        case "F":
            page.value.pageIndex=1;
            break;
        case "E":
            page.value.pageIndex=page.value.pageIndex-1;
            break;
        case "I":
            page.value.pageIndex=page.value.pageIndex+1;
            break;
        case "D":
            page.value.pageIndex=page.value.pageCount;
            break;
        
        default:
    }
    if(page.value.pageIndex<1){
        page.value.pageIndex=1;
        return
    }
    if(page.value.pageIndex>page.value.pageCount){
        page.value.pageIndex=page.value.pageCount;
        return
    }
    show();
}

const Csize = ref('');
    
const ChangeSize=()=>{
    var size = Csize.value;
    page.value.pageSize=size;
    show();
}

const Tindex = ref('');

const TakeShowInfo = () =>{
    const index = Tindex.value;

    if(index=="")
    {
        alert("跳转页码不能为空");
        return;
    }

    if(isNaN(Number(index)))
    {
        alert("跳转页码必须为数字");
        return;
    }

    if(Number(index)<1)
    {
        alert("跳转页码不能小于1");
        return;
    }
    if(Number(index)>page.value.pageCount)
    {
        alert("跳转页码不能大于总页数");
        return;
    }

    page.value.pageIndex=Number(index);
    show();
}

const DeleteInfo = (Iid:number)=>{
    if(confirm("确认要删除吗？"))
    {
        axios({
            url:"http://localhost:58004/api/invest/DeleteInvestinfo",
            method:"delete",
            params:{
                Iid:Iid
            }
        })
        .then(res=>{
            console.log(res.data);
            if(res.data>0)
            {
                alert("删除成功");
                show();
            }
            else if(res.data==-1)
            {
            alert('当前项目有人投资无法删除');
            return;
            }
            else
            {
                alert("删除失败");
            }
            
        })
        .catch(err=>{
            console.log(err);
        })
    }
}

const UpdateInfo = (Iid:number)=>{
    router.push({
        path:'/UpdateInvest',
        query:{
            Iid:Iid
        }
    })
}



</script>
